/******************************************************************************
* File description: MaintenanceJiaReKuai2WenDuTable.qml
* Function: 维护-加热块：温度校准表格
* Current Version: 1.0.0
* Author: 张宇轩
* Date: 2024-08-29
*  -----
*  Copyright by 博坤生物 .
 *****************************************************************************/
import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.14
import Qt.labs.qmlmodels 1.0

Item {
    id: root

    /* property 定义开始 */
    property int plateRowCount: 2 // 反应板行数
    property int plateColCount: 6 // 反应板列数
    // 字母表
    property var alphabetList: ["A", "B", "C", "D", "E", "F"]
    // 纵向表头数组
    property var verHeaderList: ["K值", "B值"]
    // 横向表头高
    property int horizontalHeaderHeight: 40
    // 纵向表头宽
    property int verticalHeaderWidth: 113
    // 左上角角落
    property string cornerColor: "#FFEBF3FF"
    property int cornerBorderWidth: 0
    property string cornerBorderColor: "transparent"
    // 表格数据
    property var tableModels: []

    // private
    property int _itemIndex: 0 // 记录每个代理对象的下表，反推出所在行列
    property var _startPoint: [-1, -1] // 记录起点坐标
    property var _endPoint: [-1, -1] // 记录终点坐标
    property bool _isPressed: false // 鼠标按下信号
    property int _curMouseRow: -1 // 鼠标当前所在行
    property int _curMouseCol: -1 // 鼠标当前所在列
    property var _tableModel: root.tableModels

    // 信号
    signal pressedIndex(int index) // 发送表格下标信号

    // 函数
    // 下标转行列
    function index2RowCol(index){
        return [parseInt(index / plateColCount), index % plateColCount]
    }

    // 行列转下标
    function rowCol2Index(row, col){
        return row * plateColCount + col
    }

    /* property 定义结束 */

    GLOBAL{id: global}

    width: parent.width
    Layout.preferredHeight: horizontalHeader.height + verticalHeader.height
    clip: true

    Rectangle {
        id: table
        width: parent.width
        height: horizontalHeader.height + verticalHeader.height
        color: "#FFEBF3FF"
        clip: true
        border.width: 1
        border.color: "transparent"

        // 横向表头
        Item {
            id: horizontalHeader
            width: parent.width - verticalHeader.width
            height: horizontalHeaderHeight
            anchors {
                top: parent.top
                left: parent.left
                leftMargin: verticalHeader.width
            }

            Row {
                spacing: 0

                Repeater {
                    model: plateColCount

                    Rectangle {
                        width: horizontalHeader.width / plateColCount
                        height: horizontalHeader.height
                        color: "transparent"
                        border.width: 0

                        Text {
                            text: qsTr((index+1).toString())
                            anchors.centerIn: parent
                            font.pixelSize: 16
                            font.family: "Alibaba PuHuiTi"
                            color: "#FF222222"
                        }

                        Component.onCompleted: {
                            // 画边框
                            global.createLeftBorder(this, 2, "#FFCCCCCC")
                            global.createTopBorder(this, 2, "#FFCCCCCC")
                        }
                    }
                }
            }
        }

        // 纵向表头
        Item {
            id: verticalHeader
            width: verticalHeaderWidth
            height: horizontalHeaderHeight * 2
            anchors {
                top: parent.top
                left: parent.left
                topMargin: horizontalHeaderHeight
            }

            Column {
                spacing: 0

                Repeater {
                    model: root.verHeaderList

                    Rectangle {
                        width: verticalHeader.width
                        height: horizontalHeaderHeight
                        color: "transparent"
                        border.width: 0

                        Text {
                            text: qsTr(modelData)
                            anchors.centerIn: parent
                            font.pixelSize: 16
                            font.family: "Alibaba PuHuiTi"
                            color: "#FF222222"
                        }

                        Component.onCompleted: {
                            // 画上边框
                            global.createTopBorder(this, 2, "#FFCCCCCC")
                            // 结尾画下边框
                            global.createBottomBorder(this, 2, "#FFCCCCCC", index === root.plateRowCount-1)
                        }
                    }
                }
            }
        }

        // 左上角
        Rectangle {
            id: leftTopCorner
            width: verticalHeader.width
            height: horizontalHeader.height
            anchors {
                top: parent.top
                left: parent.left
                right: horizontalHeader.left
                bottom: verticalHeader.top
            }
            color: root.cornerColor
            border.width: root.cornerBorderWidth
            border.color: root.cornerBorderColor

            // 区域
            Label {
                anchors {
                    top: parent.top
                    right: parent.right
                    topMargin: 5
                    rightMargin: 10
                }
                font.pixelSize: 16
                color: "#FF222222"
                text: "区域"
            }

            // 数值
            Label {
                anchors {
                    bottom: parent.bottom
                    left: parent.left
                    bottomMargin: 5
                    leftMargin: 10
                }
                font.pixelSize: 16
                color: "#FF222222"
                text: "数值"
            }

            // 斜线
            Canvas {
                anchors.fill: parent
                antialiasing: true
                onPaint: {
                    var ctx = getContext("2d")
                    ctx.strokeStyle = "#FFCCCCCC"
                    ctx.lineWidth = 2
                    ctx.beginPath()
                    ctx.moveTo(0, 0)
                    ctx.lineTo(width, height)
                    ctx.stroke()
                }
            }

            // 绘制框线
            Component.onCompleted: {
                global.createTopBorder(this, 2, "#FFCCCCCC")
            }
        }

        // 表格内容
        TableView {
            id: tableContent
            width: horizontalHeader.width
            height: verticalHeader.height
            anchors {
                top: parent.top
                left: parent.left
                topMargin: horizontalHeader.height
                leftMargin: verticalHeader.width
            }
            clip: true
            boundsBehavior: Flickable.StopAtBounds
            columnSpacing: 0
            rowSpacing: 0

            columnWidthProvider: function(column){
                return tableContent.width / plateColCount
            }

            rowHeightProvider: function(row){
                return horizontalHeaderHeight
            }

            onWidthChanged: {
                forceLayout() // 强制重新布局刷新视图
            }

            onHeightChanged: {
                forceLayout() // 强制重新布局刷新视图
            }

            model: TableModel {
                id: tableModel

                TableModelColumn {display: "A"}
                TableModelColumn {display: "B"}
                TableModelColumn {display: "C"}
                TableModelColumn {display: "D"}
                TableModelColumn {display: "E"}
                TableModelColumn {display: "F"}

                rows: root._tableModel
            }

            delegate: Rectangle{
                id: tableDelegate

                // 保存变量
                property int curRow: row
                property int curCol: column
                // 边框
                property QtObject leftBorder: null
                property QtObject topBorder: null
                property QtObject bottomBorder: null

                implicitWidth: tableContent.columnWidthProvider(column)
                implicitHeight: tableContent.rowHeightProvider(row)
                color: "transparent"

                Component.onCompleted: {
                    // 边框
                    tableDelegate.leftBorder = global.createLeftBorder(this, 2, "#FFCCCCCC")
                    tableDelegate.topBorder = global.createTopBorder(this, 2, "#FFCCCCCC")
                    tableDelegate.bottomBorder = global.createBottomBorder(this, 2, "#FFCCCCCC", row === root.plateRowCount-1)
                }

            }

            Component.onCompleted: {
                root.tableModels = [
                            {"A": "", "B": "", "C": "", "D": "", "E": "", "F": "", "G": "", "H": "", "I": "", "J": "", "K": "", "L": ""},
                            {"A": "", "B": "", "C": "", "D": "", "E": "", "F": "", "G": "", "H": "", "I": "", "J": "", "K": "", "L": ""},
                            {"A": "", "B": "", "C": "", "D": "", "E": "", "F": "", "G": "", "H": "", "I": "", "J": "", "K": "", "L": ""},
                            {"A": "", "B": "", "C": "", "D": "", "E": "", "F": "", "G": "", "H": "", "I": "", "J": "", "K": "", "L": ""},
                            {"A": "", "B": "", "C": "", "D": "", "E": "", "F": "", "G": "", "H": "", "I": "", "J": "", "K": "", "L": ""},
                            {"A": "", "B": "", "C": "", "D": "", "E": "", "F": "", "G": "", "H": "", "I": "", "J": "", "K": "", "L": ""},
                            {"A": "", "B": "", "C": "", "D": "", "E": "", "F": "", "G": "", "H": "", "I": "", "J": "", "K": "", "L": ""},
                            {"A": "", "B": "", "C": "", "D": "", "E": "", "F": "", "G": "", "H": "", "I": "", "J": "", "K": "", "L": ""}
                        ]
            }
        }
    }
}
